<template>
  <div
    :style="`background-image:url(${bg});${
      type ? 'text-indent: 60px;' : 'text-indent: 25px;'
    }`"
    class="stitle"
    @click="sclick"
  >
    <span>{{ text }}</span>
  </div>
</template>

<script>
export default {
  props: {
    text: {
      type: String,
      required: false,
      default: "",
    },
    bg: {
      type: String,
      required: false,
      default: "",
    },
    type: {
      type: Number,
      required: false,
      default: 1,
    },
  },
  name: "stitle",
  data() {
    return {};
  },
  methods: {
    sclick() {
      this.$emit("sclick");
    },
  },
  mounted() {},
};
</script>

<style  scoped>
.stitle {
  width: 100%;
  height: 50px;
  margin: auto;
  color: #fff;
  margin-bottom: 10px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  line-height: 50px;
  font-family: HYLXTJ;
  color: #c0d8f0;
  letter-spacing: 2px;
  font-size: 16px;
  font-style: oblique;
}
</style>